﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> 
<%String basePath = request.getContextPath(); %>
<%@ include file="../header/header_list.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../../css/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="../../css/global_color.css" />
        <script language="javascript" type="text/javascript">
            //保存成功的提示消息
            function showResult() {
                showResultDiv(true);
                window.setTimeout("showResultDiv(false);", 3000);
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else
                    divResult.style.display = "none";
            }
        </script>
    </head>
    <body>
        <!--主要区域开始-->
        <div id="main">            
            <!--保存操作后的提示信息：成功或者失败-->
            <div id="save_result_info" class="save_success"><span id=show></span>！</div><!--保存失败，角色名称重复！-->
            <form action="" method="" class="main_form">
                <div class="text_info clearfix"><span>角色名称：</span></div>
                <div class="input_info">
                    <input type="text" class="width200" id="rolename"/>
                    <span class="required">*</span>
                    <div class="validate_msg_medium">不能为空，且为20长度的字母、数字和汉字的组合</div>
                </div>                    
                <div class="text_info clearfix"><span>设置权限：</span></div>
                <div class="input_info_high">
                    <div class="input_info_scroll">
                        <ul>
<!--                             <li><input type="checkbox" id="checkpowerid" value="1"/>管理员管理</li>
 -->                        <li><input type="checkbox" id="checkpowerid" value="1"/>角色管理</li>
                            <li><input type="checkbox" id="checkpowerid" value="2"/>资费管理</li>
                            <li><input type="checkbox" id="checkpowerid" value="3"/>账务账号</li>
                            <li><input type="checkbox" id="checkpowerid" value="4"/>业务账号</li>
                            <li><input type="checkbox" id="checkpowerid" value="5"/>账单</li>
                            <li><input type="checkbox" id="checkpowerid" value="6"/>报表</li>
                        </ul>
                    </div>
                    <span class="required">*</span>
                    <div class="validate_msg_tiny">至少选择一个权限</div>
                </div>
                <div class="button_info clearfix">
                    <input type="button" value="保存" class="btn_save" id="btn_save" onclick="showResult()" />
                    <input type="button" value="取消" class="btn_save" />
                </div>
            </form>
        </div>
        <!--主要区域结束-->
        <div id="footer">
          
        </div>
        
         <script src="<%=basePath %>/js/jquery-3.3.1.js" type="text/javascript">
        </script>
	<script type="text/javascript">
		$(document).ready(function() { //定义最后加载   
			$("#btn_save").click(function() {
				var cb = $(":checkbox");
				var b = false;
				cb.each(function (){
					if($(this).prop("checked")){
						$.ajax({
							url : '<%=basePath %>/InsertRoleServlet',
							type : 'GET',
							data : {
								"rolename":$("#rolename").val(),			
								"checkpower":$(this).attr("value")
							},
							dataType : "text",
							success : function(result) {
								$("#show").html(result);
							},
						});
					}
				})
				
			})
		})
	</script>
    </body>
</html>
